<template>
	<view class="animated fadeIn faster">
		<view class="status-bar-height bg-bar"></view>
		<view class="py-3 pl-2 pr-3 d-flex d-flex-middle bg-bar">
			<view class="pr-2" @click="goback">
				<text class="iconfont icon-31fanhui1 font36 color999"></text>
			</view>
			<view class="search-box pl-2 d-flex d-flex-middle d-flex-item">
				<text class="iconfont icon-chazhao font-bold font32 mr-1 colorhold"></text>
				<input placeholder="请输入用户昵称" class="d-flex-item" :focus="focus" v-model="keyword" @confirm="doSearch" confirm-type="done" placeholder-class="colorhold"/>
				<text class="iconfont icon-cuowu1 font32 colorhold mr-2" v-if="keyword" @click="keyword = ''"></text>
			</view>
			
		</view>	
		<block v-for="item in dataList" :key="item._id">
			<view class="d-flex" @click="toChat(item._id)">
				<view class="avatar">
					<image class="rounded15" :src="item.avatar_file?.url || 'https://www.168802.xyz/avatar/avatarUrl.png'" mode="aspectFill" style="width: 100rpx;height: 100rpx;"></image>
				</view>
				<view class="callinfo d-flex-item d-flex d-flex-middle">
					<text class="font32">{{item.nickname}}</text>
				</view>
			</view>
		</block>
		<view class="d-flex d-flex-center" style="padding-top: 300rpx;" v-if="loadMoreStatus == 0">
			<text class="colorhold font26">未搜索到任何用户信息~</text>
		</view>
	</view>
</template>

<script>
	import uniIm from '@/uni_modules/uni-im/sdk/index.js';
	const db = uniCloud.database();
	export default {
		data() {
			return {
				userinfo:{
					_id:'',
					nickname:'',
					avatar_file:{
						url:''
					}
				},
				dataList:[],
				keyword:'',
				focus:true,
				udbWhere:'',
				loadMoreStatus:2
			}
		},
		onReady() {
			const userinfo = uni.getStorageSync('uni-id-pages-userInfo')
			if(userinfo){
				this.userinfo = userinfo
			}
		},
		methods: {
			goback(){
				uni.navigateBack()
			},
			async doSearch(){
				if(!this.keyword){
				  return uni.showToast({
				  	title:'请输入用户昵称！',
					icon:'none'
				  })
				}
				uni.showLoading({
					title:'加载中...'
				})
				try{
					const where = `/${this.keyword}/.test(nickname)`
					const res = await db.collection('uni-id-users').where(where).field('_id,nickname,avatar_file').get()
					this.dataList = res.result.data
					if(this.dataList.length>0){
						this.loadMoreStatus = 1
					}else{
						this.loadMoreStatus = 0
					}
					uni.hideLoading()
				}catch(e){
					uni.hideLoading()
				}
			},
			toChat(cid){
				this.loadMoreStatus = 2
				this.dataList = []
				if(this.userinfo._id == cid){
					uni.switchTab({
						url:'/pages/mine/mine'
					})
				}else{
					uni.navigateTo({
					  url: '/uni_modules/uni-im/pages/chat/chat?user_id=' + cid,
					  animationDuration: 300
					})
				}
				
			},
			
		}
	}
</script>

<style scoped>
	.avatar{
		padding-top: 22rpx;
		padding-bottom: 22rpx;
		padding-left: 30rpx;
		padding-right: 25rpx;
		
	}
	.callinfo{
		height: 144rpx;
		padding-right: 30rpx;
		border-bottom: solid 1px #ececec;
	}
</style>
